<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8" />
    <title>Document</title>
    <style></style>
  </head>
  <body>
    <div>
      <h1>Symbol一种全选的原始数据结构</h1>
      <p>1.作用是表示一个独一无二的值,通过Symbol创建的值都是独一无二的</p>
      <p>2.目前最主要的作用就是为对象添加一个独一无二的属性名</p>
      <p>
        3.全局复用使用相同的Symbol值可以使用Symbol的静态方法for,传入for方法的值会自动转为字符串
      </p>
    </div>
    <script>
      const s = Symbol();
      console.log(s); //Symbol()
      console.log(typeof s); //symbol

      //symbol作为属性名
      const obj = {
        [Symbol()]: 123,
      };
      console.log(obj); //{Symbol() : 123}

      //模拟创建对象的私有成员
      const name = Symbol();
      const person = {
        [name]: "xjq",
        say() {
          console.log(this[name]);
        },
      };

      //symbol的唯一性
      console.log(Symbol() === Symbol()); // false
      console.log(Symbol(123) === Symbol(123)); // false

      //Symbol静态方法for,全局使用相同的Symbol
      const s1 = Symbol.for("foo");
      const s2 = Symbol.for("foo");
      console.log(s1 === s2); // true
      //内部会对值进行处理
      console.log(Symbol.for(true) === Symbol.for("true")); // true

      //内置Symbol常量,可以让自定义对象实现js内置接口
      //   Symbol.iterator();
      //   Symbol.hasInstance();

      const obj2 = {
        [Symbol.toStringTag]: "Xobject",
      };
      console.log(obj2.toString()); //[object  Xobject]

      //Symbol值作为对象的属性名,通过传统的for-in或者Object.key是无法拿到的
      const obj3 = {
        [Symbol()]: "symbol value",
        foo: "normal value",
      };
      for (let key in obj3) {
        console.log(key); //foo
      }
      const o = Object.keys(obj3);
      console.log(o); //foo

      //使用JSON.stringify,Symbol也会被忽略
      console.log(JSON.stringify(obj)); //  {}

      //   Object.getOwnPropertySymbols可以获取
      console.log(Object.getOwnPropertySymbols(obj3)); //[Symbol()]
    </script>
  </body>
</html>
